<div>
    <h6>扁平风格按钮</h6>
</div>
<div>
    <h6>立体风格按钮</h6>
</div>
<div>
    <h6>基本样式</h6>
    <button type="button" class="am-btn am-btn-default">默认样式</button>
    <button type="button" class="am-btn am-btn-primary">主色按钮</button>
    <button type="button" class="am-btn am-btn-secondary">次色按钮</button>
    <button type="button" class="am-btn am-btn-success">绿色按钮</button>
    <button type="button" class="am-btn am-btn-warning">橙色按钮</button>
    <button type="button" class="am-btn am-btn-danger">红色按钮</button>
</div>
<div>
    圆角按钮
    <button type="button" class="am-btn am-btn-default am-radius">默认样式</button>
</div>
<div>
    按钮尺寸
    .am-btn-xl
    .am-btn-lg
    .am-btn-default
    .am-btn-sm
    .am-btn-xs
    .am-btn-block
</div>
<div>
    禁用按钮
</div>
<div>
    图标按钮
    <button class="am-btn am-btn-default">
        <i class="am-icon-cog"></i>
        新增
    </button>
    <button class="am-btn am-btn-default">
        <i class="am-icon-cog"></i>
        编辑
    </button>
    <button class="am-btn am-btn-default">
        <i class="am-icon-cog"></i>
        删除
    </button>
    <button class="am-btn am-btn-default">
        <i class="am-icon-cog"></i>
        刷新
    </button>
    <button class="am-btn am-btn-default">
        <i class="am-icon-cog"></i>
        设置
    </button>

    <a class="am-btn am-btn-warning" href="#">
        <i class="am-icon-shopping-cart"></i>
        购物车
    </a>

    <button class="am-btn am-btn-default">
        <i class="am-icon-spinner am-icon-spin"></i>
        加载中
    </button>

    <button class="am-btn am-btn-primary">
        下载
        <i class="am-icon-cloud-download"></i>
    </button>
    更多图标请参考：<a href="图标.html">图标</a>
</div>
<div class="xsui-source-code">
    <h3>源代码</h3>
    <code>
        &lt;!DOCTYPE html&gt;
        &lt;html&gt;
        &lt;head&gt;
        &lt;meta charset="UTF-8"&gt;
        &lt;title&gt;Basic LinkButton - jQuery EasyUI Demo&lt;/title&gt;
        &lt;link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css"&gt;
        &lt;link rel="stylesheet" type="text/css" href="../../themes/icon.css"&gt;
        &lt;link rel="stylesheet" type="text/css" href="../demo.css"&gt;
        &lt;script type="text/javascript" src="../../jquery.min.js"&gt;&lt;/script&gt;
        &lt;script type="text/javascript" src="../../jquery.easyui.min.js"&gt;&lt;/script&gt;
        &lt;/head&gt;
        &lt;body&gt;
        &lt;h2&gt;Basic LinkButton&lt;/h2&gt;
        &lt;p&gt;Buttons can be created from &amp;lt;a&amp;gt; or &amp;lt;button&amp;gt; elements.&lt;/p&gt;
        &lt;div style="margin:10px 0 40px 0;"&gt;&lt;/div&gt;
        &lt;p&gt;Basic Buttons&lt;/p&gt;
        &lt;div style="padding:5px 0;"&gt;
        &lt;a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add'"&gt;Add&lt;/a&gt;
        &lt;a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-remove'"&gt;Remove&lt;/a&gt;
        &lt;a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-save'"&gt;Save&lt;/a&gt;
        &lt;a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-cut',disabled:true"&gt;Cut&lt;/a&gt;
        &lt;a href="#" class="easyui-linkbutton"&gt;Text Button&lt;/a&gt;
        &lt;/div&gt;
        &lt;p&gt;Fixed Width Buttons&lt;/p&gt;
        &lt;div style="padding:5px 0;"&gt;
        &lt;a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" style="width:80px"&gt;Search&lt;/a&gt;
        &lt;a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-print'" style="width:80px"&gt;Print&lt;/a&gt;
        &lt;a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-reload'" style="width:80px"&gt;Reload&lt;/a&gt;
        &lt;a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-help'" style="width:80px"&gt;Help&lt;/a&gt;
        &lt;/div&gt;

        &lt;/body&gt;
        &lt;/html&gt;
    </code>
</div>